{% extends '__base__.html' %}
{% load staticfiles %}

{% block content %}

    {#        表格有数据时展示#}
    <div class="app-title">
        {#            页面简介区域#}
        <div>
            <h1><i class="fa fa-th-list"></i> 应用管理</h1>
            {% if application_manage %}
                <p> IIS 站点、Java应用列表</p>
            {% else %}
                <p>No applications are available.</p>
            {% endif %}
        </div>
        {#            面包屑区域#}
        <ul class="app-breadcrumb breadcrumb side">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item">系统管理</li>
            <li class="breadcrumb-item active"><a href="#">应用管理</a></li>
        </ul>
    </div>
    {#        操作结果提示栏区域#}
    <div class="row">
        <div class="col-lg-12">
            <div class="bs-component">
                <div class="alert alert-dismissible" id="notice" style="display: none;">
                    <button class="close" type="button" data-dismiss="alert">×</button>
                    <h4></h4>
                    <p><a class="alert-link" href="#"></a>
                    </p>
                </div>
            </div>
        </div>
    </div>
    {#        按钮区域#}
    <div>
        <button class="btn btn-success" type="button"
                onclick="window.location.href='{% url "system:application_add" %}'">添加应用
        </button>
    </div>
    {% if application_manage %}
        {#        表格区域#}
        <div class="row">
            <div class="col-md-12">
                <div class="tile">
                    {#                    表格数据区域#}
                    <div class="tile-body table-responsive" id="table">
                        <table class="table table-hover table-bordered" id="sampleTable"
                               style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
                            <thead>
                            <tr>
                                <th>站点名称</th>
                                <th>站点简称</th>
                                <th>配置文件夹名称</th>
                                <th>配置文件名称</th>
                                <th>所属ECS</th>
                                <th>所属站点族</th>
                                <th>操作</th>
                                <th>状态</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for application in application_manage %}
                                <tr>
                                    <td>
                                        <a href="{% url 'system:application_change' application.id %}">{{ application.fullname }}</a>
                                    </td>
                                    <td>{{ application.short_name }}</td>
                                    <td>{{ application.config_dir_name }}</td>
                                    <td>
                                        {% for config_file in application.configfile_set.all %}
                                            <span>{{ config_file.filename }}</span><br/>
                                        {% endfor %}
                                    </td>
                                    <td>
                                        {% for ecs in application.ECS_lists.all %}
                                            <span>{{ ecs }}</span><br/>
                                        {% endfor %}
                                    </td>
                                    <td>
                                        {{ application.application_race.alias }}
                                    </td>
                                    <td>
                                        <a class="btn btn-outline-primary"
                                           href="{% url 'system:application_change' application.id %}">修改</a>
                                        <a class="btn btn-outline-danger" id="demoSwal{{ forloop.counter }}" href="#">删除</a>
                                    </td>
                                    <td>
                                        {% if application.status == 'N' %}<span class="text-danger">禁用</span>{% else %}
                                            启用{% endif %}
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    {% else %}
        <div class="row">
            <div class="col-md-12">
                <div class="tile">
                    <div class="tile-body">请先添加应用</div>
                </div>
            </div>
        </div>
    {% endif %}

{% endblock %}

{% block custom_static %}

    <!-- Data table plugin-->
    <script type="text/javascript" src="{% static 'js/plugins/jquery.dataTables.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'js/plugins/dataTables.bootstrap.min.js' %}"></script>
    <script type="text/javascript">$('#sampleTable').DataTable();</script>

    <!--Delete Alarm-->
    <script type="text/javascript" src="{% static 'js/plugins/sweetalert.min.js' %}"></script>
    <script type="text/javascript">
        $.ajaxSetup({
            data: {csrfmiddlewaretoken: '{{ csrf_token }}'},
        });
        {% for application in application_manage %}
            $('#demoSwal{{ forloop.counter }}').click(function () {
                swal({
                    title: "Are you sure?",
                    text: "You will not be able to recover this imaginary file!",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonText: "Yes, delete it!",
                    cancelButtonText: "No, cancel plx!",
                    closeOnConfirm: false,
                    closeOnCancel: false
                }, function (isConfirm) {
                    if (isConfirm) {
                        let postUrl = "{% url 'system:application_delete' application.id %}";
                        $.post(postUrl, function (data) {
                            if (data.success) {
                                swal("Deleted!", "Your imaginary file has been deleted.", "success");
                                location.reload();
                            }
                            else {
                                alert(data.message);
                            }
                        })
                    } else {
                        swal("Cancelled", "Your imaginary file is safe :)", "error");
                    }
                });
            });
        {% endfor %}
    </script>

{% endblock %}